<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>

<script type="text/javascript">
		function popUp(value){
			var url = 'pop_upReport.do?p_id='+value;
			open(url,'신고하기','toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no,width=325,height=485'); 
		}


	$(function(){
		
		$('.sendMessageForm').click(function(event){
			var receiverid = document.getElementById('sendReceiverid').value;
			var content = document.getElementById('sendContent').value;
			
			$.getJSON('messageSendOk.do',{receiverid:receiverid,content:content},function(data){
				
				var myPoint = data.myPoint;
				
				if(data.noAdmin=='fail'){
					$('.messageErrors').html('죄송합니다. 사이트 혹은 개인적인 문의는 게시판을 통해 알려주세요').css('color','red');
				}else{
					if(data.myId == 'fail'){ //자기아이디
						$('.messageErrors').html('자기 자신에겐 보낼수 없습니다. 잔여포인트 : '+myPoint).css('color','red');
					}else{
						if(data.deleteMember=='fail'){
							$('.messageErrors').html('탈퇴한 회원입니다. 잔여포인트 : '+myPoint).css('color','red');
						}else{
							if(data.noReceiId=='fail'){ //아이디가 없음
								$('.messageErrors').html('아이디가 존재하지 않습니다. 잔여포인트 : '+myPoint).css('color','red');
							}else{
								if(data.sendOk=='fail'){ //포인트가 부족함
									$('.messageErrors').html('포인트가 부족합니다. 잔여포인트 : '+myPoint).css('color','red');
								}else{
									$('.messageErrors').html('전송 완료. 잔여포인트 : '+myPoint).css('color','blue');
								}
							}
						}
					}
				}
			});
		event.preventDefault();
		});
	});
	
</script>
		



<div class="container">
	<div id="info" class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
		<h2><img src="./image/title_img3.jpg"/></h2>
	</div>

	<div id="messageDiv" class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
		<%-- 메세지 헤더 --%>
		<div id="messageHeader" class="col-xs-12 col-sm-12 col-md-12 col-lg-12 talk-align-center">
			<ul class="col-md-2 col-lg-2 col-sm-1 col-xs-0"><li></li></ul>
			<ul class="col-md-8 col-lg-8 col-sm-10 col-xs-12 nav nav-tabs" id="messageTags">
				<li class="col-xs-4 col-sm-4 col-md-4 col-lg-4"><a href="/SomeTalk/messageForm.do?method=receiverid"><img src="./image/title_img19.jpg"></a></li>
				<li class="col-xs-4 col-sm-4 col-md-4 col-lg-4"><a href="/SomeTalk/messageForm.do?method=senderid"><img src="./image/title_img20.jpg"></a></li>
				<li class="col-xs-3 col-sm-3 col-md-3 col-lg-3"><a href="/SomeTalk/messageSend.do"><img src="./image/title_img21.jpg"></a></li>
			</ul>
		</div>


		<div id="messageBody" class="col-xs-12 col-sm-12 col-md-12 col-lg-12 talk-align-center">
			<%-- 메세지 목록 --%>
			<c:if test="${type==1 }">
				<div class="col-md-2 col-lg-2 col-xs-0 col-sm-1"></div>
				<div class="messages col-md-8 col-lg-8 col-xs-12 col-sm-10">
				<c:if test="${count==0 }">
				<table class="table">
					<tr>
						<td>메세지가 없습니다.</td>
					</tr>
				</table>
				</c:if>
				<c:if test="${count>0 }">
					<table class="table table-hover table-white">
						<tr>
							<th>번호</th>
							<c:if test="${method=='senderid' }">
								<th>받는이</th>
							</c:if>
							<c:if test="${method=='receiverid' }">
								<th>보낸이</th>
							</c:if>
							<th>내용</th>
							<th>날짜</th>
						</tr>
						<c:forEach var="message" items="${messageList }">
							<tr>
								<td>${number }
									<c:set var="number" value="${number-1 }"/>
								</td>
								<td>
									<div class="dropdown" id="dropdowns">
										<c:if test="${method=='senderid' }">
											<c:set var="messageMethod" value="${message.receiverid }"/>
										</c:if>		
										<c:if test="${method=='receiverid' }">
											<c:set var="messageMethod" value="${message.senderid }"/>
										</c:if>
										<a href="#" class="dropdown-toggle" data-toggle="dropdown" id="methodId">${messageMethod }</a>
										<ul class="dropdown-menu" role="menu">
											<li class="text-center">
												<span class="reportspan" onclick="location.href='/SomeTalk/messageSend.do?sendId=${messageMethod }'">&nbsp;&nbsp;답장&nbsp;&nbsp;</span>
												<span class="reportspan" onclick="popUp(this.id)" id="${messageMethod }">신고</span>
											</li>
										</ul>
									</div>
								</td>
								<td><a href="/SomeTalk/messageView.do?num=${message.num }" >${message.content }</a></td>
								<td>${message.reg_date}</td>
							</tr>
						</c:forEach>
						</table>
					</c:if>
				</div>
			</c:if>
			
			<%--  메세지 상세 보기 --%>
			<c:if test="${type==2 }">
				<div class="col-md-2 col-lg-2 col-xs-0 col-sm-1"></div>
				<form class="detailMessageForm form col-md-8 col-lg-8 col-xs-12 col-sm-10" role="form">
					<div class="messageTitle col-md-12 col-lg-12 col-xs-12 col-sm-12 form-group">
						<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3"></div>
						<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
							<p class="form-control-static">${opponent }${messageType }</p>
						</div>
						<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3"></div>
					</div><br>
					
					<div class="messageSeb col-md-12 col-lg-12 col-xs-12 col-sm-12 form-group">
						<div class="col-lg-1 col-md-1 col-sm-1 col-xs-1"></div>
						<label class="col-lg-2 col-md-2 col-sm-2 col-xs-2 control-label">날짜</label>
						<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
							<p class="form-control-static">${message.reg_date }</p>
						</div>
					</div><br>
					
					<div class="messageContent col-md-12 col-lg-12 col-xs-12 col-sm-12 form-group">
						<div class="col-lg-1 col-md-1 col-sm-1 col-xs-1"></div>
						<label class="col-lg-2 col-md-2 col-sm-2 col-xs-2 control-label">내용</label>
						<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
							<p class="form-control-static">${message.content }</p>
						</div>
					</div><br>
					<div class="col-md-12 col-lg-12 col-xs-12 col-sm-12 form-group">
						<button type="button" class="btn btn-info" onclick="location.href='/SomeTalk/messageDelete.do?num=${message.num}'">삭제</button>
						<button type="button" class="btn btn-default" onclick="history.go(-1)">뒤로</button>
					</div>
				</form>
			</c:if>
			
			<%-- 메세지 쓰기 --%>
			<c:if test="${type==3 }">
				<div class="col-md-1 col-lg-2 col-xs-0 col-sm-0"></div>
				<div class="sendForm col-md-10 col-lg-8 col-xs-12 col-sm-12">
					<div class="senderHeader col-md-12 col-lg-12 col-xs-12 col-sm-12 form-group">
						<label for="receiverid" class="col-xs-2 col-xs-offset-1 col-sm-2 col-sm-offset-1 col-md-2 col-md-offset-1 col-lg-2 col-lg-offset-1 text-right control-label">보낼 사람</label>
						<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6 text-center">
							<input type="text" class="form-control" id="sendReceiverid" value="${sendId }" name="receiverid" maxlength="20" placeholder="받은이의 아이디를 입력하세요" required="required">
						</div>
					</div>
					<div class="senderSub col-md-12 col-lg-12 col-xs-12 col-sm-12 form-group">
						<span class="col-xs-6 col-xs-offset-3 col-sm-6 col-sm-offset-3 col-md-6 col-md-offset-3 col-lg-6 col-lg-offset-3 messageErrors text-left"></span>
					</div>
					<div class="senderBody col-md-12 col-lg-12 col-xs-12 col-sm-12 form-group">
						<label for="content" class="col-xs-2 col-xs-offset-1 col-sm-2 col-sm-offset-1 col-md-2 col-md-offset-1 col-lg-2 col-lg-offset-1 text-right control-label">내용</label>
						<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6 text-center">
							<textarea class="form-control" rows="10" id="sendContent" name="content" maxlength="100" placeholder="내용을 입력하세요" required="required"></textarea>
						</div>
					</div>
					<div class="senderFooter col-md-12 col-lg-12 col-xs-12 col-sm-12 form-group">
						<button type="button" class="btn btn-primary btn-sm sendMessageForm">전송</button>
						<button type="button" class="btn btn-default btn-sm" onclick="history.go(-1)">뒤로</button>
					</div>
				</div>
				
			</c:if>
		</div>
		
		<%-- 메세지 페이징 --%>
		<div id="messageFooter" class="col-xs-12 talk-align-center">
			<div class="row">
				<div>${pagingHtml }</div>
			</div>
		</div>
		
	</div>
</div>
								